<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>游玩</title>
    <meta name="viewport" content="initial-scale=1, maximum-scale=1">
    <link rel="shortcut icon" href="/favicon.ico">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">

    <link rel="stylesheet" href="//g.alicdn.com/msui/sm/0.6.2/css/sm.min.css">
    <link rel="stylesheet" href="//g.alicdn.com/msui/sm/0.6.2/css/sm-extend.min.css">
		<style type="text/css">
			.col-25{text-align: center;}
			.col-img{width: 100%; margin: 0 auto; height: 4rem;}
			.list-block{margin: 0;}
			.col-img1{width: 100%; height: 2rem;}
			.list-block .item-text{height: auto;}
		</style>
  </head>
  <body>
    <div class="page-group">
        <div class="page page-current">
	        <header class="bar bar-nav">
					  <a class="button button-link button-nav pull-left back" >
					  	<span class="icon icon-left"></span>
					    返回
					  </a>
					  <a class="button-link pull-right open-about" data-popup=".popup-about" href="#">
	            <span class="icon icon-message"></span>
	          </a>
					  <h1 class="title">众说</h1>
					</header>
					
					<div class="content">
					  <div class="content-padded grid-demo">
					    <div class="row">
					      <div class="col-25">
					      	<img src="../img/dfe.jpg" class="col-img"/>
					      </div>
					      
					      <div class="col-25">
					      	<img src="../img/dfb.jpg" class="col-img"/>
					      </div>
					      
					      <div class="col-25">
					      	<img src="../img/dfc.jpg" class="col-img"/>
					      </div>
					      
					      <div class="col-25">
					      	<img src="../img/dfd.jpg" class="col-img"/>
					      </div>
					    </div>
					  </div>
					  
					  
					  <div class="list-block media-list">
					    <ul>
					      <li>
					        <a href="#" class="item-content">
					          <div class="item-inner">
					            <div class="item-title-row">
					              <div class="item-title">雷音寺</div>
					            </div>
					            <div class="item-subtitle">2019-1-21</div>
					            <div class="item-text">现有雷音寺是本世纪初新恢复修建的一座寺院，但由于它取山河之胜，建筑宏大，富丽堂皇，具有丰富的人文景观和文化艺术价值。雷音寺现已成为黄河三峡著名的佛教圣地和旅游景点，这座寺院以崭新的面貌吸引着众多的香客和游人的到来。
</div>
											<div class="item-title-row pb-popup">
					              <div class="item-title">
					              	<div class="row">
											      <div class="col-25">
											      	<img src="../img/dfe.jpg" class="col-img1"/>
											      </div>
											      
											      <div class="col-25">
											      	<img src="../img/dfb.jpg" class="col-img1"/>
											      </div>
											      
											      <div class="col-25">
											      	<img src="../img/dfc.jpg" class="col-img1"/>
											      </div>
											      
											      <div class="col-25">
											      	<img src="../img/dfd.jpg" class="col-img1"/>
											      </div>
											    </div>
					              	
					              </div>
					            </div>
					          </div>
					        </a>
					      </li>
					    </ul>
					  </div>
					  
					  <div class="list-block media-list">
					    <ul>
					      <li>
					        <a href="#" class="item-content">
					          <div class="item-inner">
					            <div class="item-title-row">
					              <div class="item-title">观音塔</div>
					            </div>
					            <div class="item-subtitle">2019-1-21</div>
					            <div class="item-text">现塔为2004年所建，七层八角仿明、清式古塔，高 43.88米，总建筑面积700多平方米。塔内供奉观音大士铜铸三十二应身，玻璃铜彩铸大悲咒出相八十四尊，有通道拾级而上可登顶层，塔名由启功先生题写。
一座仿古塔，在濠河的映衬下，为如皋古城平添了诸多的秀丽和古味。从建筑角度，用现代的材料和技术，似乎没有过多可书可写的。
</div>
											<div class="item-title-row pb-popup">
					              <div class="item-title">
					              	<div class="row">
											      <div class="col-25">
											      	<img src="../img/dfe.jpg" class="col-img1"/>
											      </div>
											      
											      <div class="col-25">
											      	<img src="../img/dfb.jpg" class="col-img1"/>
											      </div>
											      
											      <div class="col-25">
											      	<img src="../img/dfc.jpg" class="col-img1"/>
											      </div>
											      
											      <div class="col-25">
											      	<img src="../img/dfd.jpg" class="col-img1"/>
											      </div>
											    </div>
					              	
					              </div>
					            </div>
					          </div>
					        </a>
					      </li>
					    </ul>
					  </div>
					  
					  <div class="list-block media-list">
					    <ul>
					      <li>
					        <a href="#" class="item-content">
					          <div class="item-inner">
					            <div class="item-title-row">
					              <div class="item-title">森林公园</div>
					            </div>
					            <div class="item-subtitle">2014-1-21</div>
					            <div class="item-text">森林公园以大面积人工林或天然林为主体而建设的公园。天然公园保管有自然景观。森林公园除保护森林景色自然特征外，并根据造园要求适当加以整顿布置。公园内的森林，普通只采用抚育采伐和林分改造等措施，不进行主伐。可以开展森林旅游与喜悦休闲，并按法定程序申报批准的森林地域，森林公园是经过修整可供短期自由休假的森林，或是经过逐渐改造使它形成一定的景观系统的森林。森林公园是一个综合体，它具有建筑、疗养、林木经营等多种功能，同时，也是一种以保护为前提利用森林的多种功能为人们提供各种形式的旅游服务的可进行科学文化活动的经营管理区域。在森林公园里可以自由休息，也可以进行森林浴等。
</div>
											<div class="item-title-row pb-popup">
					              <div class="item-title">
					              	<div class="row">
											      <div class="col-25">
											      	<img src="../img/dfe.jpg" class="col-img1"/>
											      </div>
											      
											      <div class="col-25">
											      	<img src="../img/dfb.jpg" class="col-img1"/>
											      </div>
											      
											      <div class="col-25">
											      	<img src="../img/dfc.jpg" class="col-img1"/>
											      </div>
											      
											      <div class="col-25">
											      	<img src="../img/dfd.jpg" class="col-img1"/>
											      </div>
											    </div>
					              	
					              </div>
					            </div>
					          </div>
					        </a>
					      </li>
					    </ul>
					  </div>
					  
					  
					  
					  
					</div>
					
        </div>
    </div>
    
    <!--popup-->
    <div class="popup popup-about">
		  <div class="content-block">
		  	<header class="bar bar-nav">
				  <h1 class="title">发布众说</h1>
				</header>
				<div class="content">
			  	<div class="list-block">
			  		<ul>
			  			<li>
				        <div class="item-content">
				          <div class="item-inner">
				            <div class="item-title label">标题</div>
				            <div class="item-input">
				              <input type="text" placeholder="">
				            </div>
				          </div>
				        </div>
				      </li>
				      <li>
				        <div class="item-content">
				          <div class="item-inner">
				            <div class="item-title label">日期</div>
				            <div class="item-input">
				              <input type="text" placeholder="" data-toggle='date'>
				            </div>
				          </div>
				        </div>
				      </li>
				      <li>
				        <div class="item-content">
				          <div class="item-inner">
				            <div class="item-title label">内容</div>
				            <div class="item-input">
				              <textarea name="" rows="" cols=""></textarea>
				            </div>
				          </div>
				        </div>
				      </li>
				      <li>
				        <div class="item-content">
				          <div class="item-inner">
				            <div class="item-title label">图片</div>
				            <div class="item-input">
				              <input type="file">
				            </div>
				          </div>
				        </div>
				      </li>
			  		</ul>
			  	</div>
			  	
			  	<div class="content-block">
				    <div class="row">
				      <div class="col-50"><a href="#" class="button button-big button-fill button-danger close-popup">取消</a></div>
				      <div class="col-50"><a href="#" class="button button-big button-fill button-success alert-text">发布</a></div>
				    </div>
				  </div>
				  
		  	</div>
		  	
		  </div>
		</div>
		

    <script type='text/javascript' src='//g.alicdn.com/sj/lib/zepto/zepto.min.js' charset='utf-8'></script>
    <script type='text/javascript' src='//g.alicdn.com/msui/sm/0.6.2/js/sm.min.js' charset='utf-8'></script>
    <script type='text/javascript' src='//g.alicdn.com/msui/sm/0.6.2/js/sm-extend.min.js' charset='utf-8'></script>
		<script type="text/javascript">
			$.init();
			$(document).on('click','.open-about', function () {
			  $.popup('.popup-about');
			});
			$(function(){
			  /*=== 默认为 standalone ===*/
			  var myPhotoBrowserStandalone = $.photoBrowser({
			      photos : [
			          '//img.alicdn.com/tps/i3/TB1kt4wHVXXXXb_XVXX0HY8HXXX-1024-1024.jpeg',
			          '//img.alicdn.com/tps/i1/TB1SKhUHVXXXXb7XXXX0HY8HXXX-1024-1024.jpeg',
			          '//img.alicdn.com/tps/i4/TB1AdxNHVXXXXasXpXX0HY8HXXX-1024-1024.jpeg',
			      ]
			  });
			  //点击时打开图片浏览器
			  $(document).on('click','.pb-standalone',function () {
			    myPhotoBrowserStandalone.open();
			  });
			   
			  /*=== Popup ===*/
			  var myPhotoBrowserPopup = $.photoBrowser({
			      photos : [
			          '//img.alicdn.com/tps/i3/TB1kt4wHVXXXXb_XVXX0HY8HXXX-1024-1024.jpeg',
			          '//img.alicdn.com/tps/i1/TB1SKhUHVXXXXb7XXXX0HY8HXXX-1024-1024.jpeg',
			          '//img.alicdn.com/tps/i4/TB1AdxNHVXXXXasXpXX0HY8HXXX-1024-1024.jpeg',
			      ],
			      type: 'popup'
			  });
			  $(document).on('click','.pb-popup',function () {
			    myPhotoBrowserPopup.open();
			  });
			});
		</script>
  </body>
</html>